<template>
	<zui-box>
		<!-- 头部导航 -->
		<zui-navbar title="黄金代售"></zui-navbar>
		<u-gap height="30rpx"></u-gap>

		<!-- 图文 -->
		<view class="image_text_box">
			<view class="image"><image src="@/static/img/sell_banner.png"></image></view>
			<view class="text">
				<view class="the_num">
					{{ info.value }}
					<text>元/克</text>
				</view>
				<view class=" the_text"></view>
				<view class="the_care">（金价参考上海黄金交易所）</view>
			</view>
		</view>

		<u-gap height="30rpx"></u-gap>

		<view class="sell_image"><image src="@/static/img/sell_image.png"></image></view>

		<u-gap height="200rpx"></u-gap>

		<zui-button  @fun="save" bgColor='#AA334F'>立即售出</zui-button>
	</zui-box>
</template>

<script>
export default {
	data() {
		return {
			info: {}
		};
	},
	onShow() {
		this.get_info();
	},
	methods: {
		get_info() {
			uni.$u.http
				.get('/app/setting/getSingle?group=gold&key=sell_gold_price', {
					params: {},
					custom: {
						auth: true,
						toast: true,
						catch: true
					}
				})
				.then(res => {
					this.info = res;
				})
				.catch(err => {});
		},
		save() {
			this.xz_go('sell_opt');
		}
	}
};
</script>

<style lang="scss" scoped>
/* //图文展示 */
.image_text_box {
	width: 670rpx;
	height: 240rpx;
	margin: 0 auto;
	position: relative;

	.image {
		width: 670rpx;
		height: 240rpx;
		position: absolute;

		image {
			width: 100%;
			height: 100%;
		}
	}

	.text {
		position: absolute;
		display: flex;
		align-items: center;
		justify-content: space-around;
		flex-flow: column;
		width: 670rpx;
		height: 240rpx;
		padding: 30rpx 0;
		box-sizing: border-box;

		.the_num {
			color: #673e00;
			font-size: 60rpx;
			text {
				margin-left: 16rpx;
				font-size: 22rpx;
			}
		}

		.the_text {
			color: #673e00;
			font-size: 22rpx;
		}
		.the_care {
			color: #e63a2a;
			font-size: 22rpx;
		}
	}
}

.sell_image {
	width: 694rpx;
	height: 462rpx;
	margin: 0 auto;
	image {
		width: 100%;
		height: 100%;
	}
}
</style>
